From: Florian Müllner Date: Tue, 3 Sep 2013 16:59:06 +0000 (+0200) Subject: appDisplay: Use a ScrollView for pages X-Git-Tag: archive/raspbian/50.5-1+rpi1~1^2~1013^2^2~3506 X-Git-Url: https://dgit.raspbian.org/%22http://www.example.com/cgi/%22/%22http:/www.example.com/cgi/%22?a=commitdiff_plain;h=36bee16781aa7fd4e5fa756495be1f3e1e9969ef;p=gnome-shell.git appDisplay: Use a ScrollView for pages While we obviously don't want any scrollbars, its fade effect will give us some extra polish when switching pages. https://bugzilla.gnome.org/show_bug.cgi?id=707409 --- diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js index 10d10d1cb..70b63efe0 100644 --- a/js/ui/appDisplay.js +++ b/js/ui/appDisplay.js @@ -167,20 +167,6 @@ const BaseAppView = new Lang.Class({ Signals.addSignalMethods(BaseAppView.prototype); -// Ignore child size requests to use the available size from the parent -const PagesBin = new Lang.Class({ - Name: 'PagesBin', - Extends: St.Bin, - - vfunc_get_preferred_height: function (forWidth) { - return [0, 0]; - }, - - vfunc_get_preferred_width: function(forHeight) { - return [0, 0]; - } -}); - const PageIndicators = new Lang.Class({ Name:'PageIndicators', @@ -273,16 +259,22 @@ const AllView = new Lang.Class({ _init: function() { this.parent({ usePagination: true }, null); - this._pagesBin = new PagesBin({ style_class: 'all-apps', - x_expand: true, - y_expand: true, - x_fill: true, - y_fill: false, - reactive: true, - y_align: St.Align.START }); + this._scrollView = new St.ScrollView({ style_class: 'all-apps', + x_expand: true, + y_expand: true, + x_fill: true, + y_fill: false, + reactive: true, + y_align: St.Align.START }); this.actor = new St.Widget({ layout_manager: new Clutter.BinLayout(), x_expand:true, y_expand:true }); - this.actor.add_actor(this._pagesBin); + this.actor.add_actor(this._scrollView); + + this._scrollView.set_policy(Gtk.PolicyType.NEVER, + Gtk.PolicyType.AUTOMATIC); + // we are only using ScrollView for the fade effect, hide scrollbars + this._scrollView.vscroll.hide(); + this._adjustment = this._scrollView.vscroll.adjustment; this._pageIndicators = new PageIndicators(); this._pageIndicators.connect('page-activated', Lang.bind(this, @@ -295,8 +287,6 @@ const AllView = new Lang.Class({ this._stack = new St.Widget({ layout_manager: new Clutter.BinLayout() }); let box = new St.BoxLayout({ vertical: true }); - this._verticalAdjustment = new St.Adjustment(); - box.set_adjustments(new St.Adjustment() /* unused */, this._verticalAdjustment); this._currentPage = 0; this._stack.add_actor(this._grid.actor); @@ -304,16 +294,16 @@ const AllView = new Lang.Class({ this._stack.add_actor(this._eventBlocker); box.add_actor(this._stack); - this._pagesBin.add_actor(box); + this._scrollView.add_actor(box); - this._pagesBin.connect('scroll-event', Lang.bind(this, this._onScroll)); + this._scrollView.connect('scroll-event', Lang.bind(this, this._onScroll)); let panAction = new Clutter.PanAction({ interpolate: false }); panAction.connect('pan', Lang.bind(this, this._onPan)); panAction.connect('gesture-cancel', Lang.bind(this, this._onPanEnd)); panAction.connect('gesture-end', Lang.bind(this, this._onPanEnd)); this._panAction = panAction; - this._pagesBin.add_action(panAction); + this._scrollView.add_action(panAction); this._panning = false; this._clickAction = new Clutter.ClickAction(); this._clickAction.connect('clicked', Lang.bind(this, function() { @@ -338,6 +328,7 @@ const AllView = new Lang.Class({ })); this._grid.connect('space-opened', Lang.bind(this, function() { + this._scrollView.get_effect('fade').enabled = false; this.emit('space-ready'); })); this._grid.connect('space-closed', Lang.bind(this, @@ -366,7 +357,7 @@ const AllView = new Lang.Class({ // use the same speed regardless of original position // if velocity is specified, it's in pixels per milliseconds let diffToPage = this._diffToPage(pageNumber); - let childBox = this._pagesBin.get_allocation_box(); + let childBox = this._scrollView.get_allocation_box(); let totalHeight = childBox.y2 - childBox.y1; let time; // Only take the velocity into account on page changes, otherwise @@ -384,7 +375,7 @@ const AllView = new Lang.Class({ if (pageNumber < this._grid.nPages() && pageNumber >= 0) { this._currentPage = pageNumber; - Tweener.addTween(this._verticalAdjustment, + Tweener.addTween(this._adjustment, { value: this._grid.getPageY(this._currentPage), time: time, transition: 'easeOutQuad' }); @@ -393,7 +384,7 @@ const AllView = new Lang.Class({ }, _diffToPage: function (pageNumber) { - let currentScrollPosition = this._verticalAdjustment.value; + let currentScrollPosition = this._adjustment.value; return Math.abs(currentScrollPosition - this._grid.getPageY(pageNumber)); }, @@ -405,6 +396,7 @@ const AllView = new Lang.Class({ _closeSpaceForPopup: function() { this._updateIconOpacities(false); + this._scrollView.get_effect('fade').enabled = true; this._grid.closeExtraSpace(); }, @@ -429,8 +421,8 @@ const AllView = new Lang.Class({ this._panning = true; this._clickAction.release(); let [dist, dx, dy] = action.get_motion_delta(0); - let adjustment = this._verticalAdjustment; - adjustment.value -= (dy / this._pagesBin.height) * adjustment.page_size; + let adjustment = this._adjustment; + adjustment.value -= (dy / this._scrollView.height) * adjustment.page_size; return false; }, @@ -438,7 +430,7 @@ const AllView = new Lang.Class({ if (this._displayingPopup) return; let diffCurrentPage = this._diffToPage(this._currentPage); - if (diffCurrentPage > this._pagesBin.height * PAGE_SWITCH_TRESHOLD) { + if (diffCurrentPage > this._scrollView.height * PAGE_SWITCH_TRESHOLD) { if (action.get_velocity(0)[2] > 0 && this._currentPage > 0) this.goToPage(this._currentPage - 1); else if (this._currentPage < this._grid.nPages() - 1) @@ -513,8 +505,8 @@ const AllView = new Lang.Class({ }, _updateAdjustment: function(availHeight) { - this._verticalAdjustment.page_size = availHeight; - this._verticalAdjustment.upper = this._stack.height; + this._adjustment.page_size = availHeight; + this._adjustment.upper = this._stack.height; }, _updateIconOpacities: function(folderOpen) { @@ -539,7 +531,7 @@ const AllView = new Lang.Class({ box.y1 = 0; box.y2 = height; box = this.actor.get_theme_node().get_content_box(box); - box = this._pagesBin.get_theme_node().get_content_box(box); + box = this._scrollView.get_theme_node().get_content_box(box); box = this._grid.actor.get_theme_node().get_content_box(box); let availWidth = box.x2 - box.x1; let availHeight = box.y2 - box.y1; @@ -549,8 +541,13 @@ const AllView = new Lang.Class({ this._grid.adaptToSize(availWidth, availHeight); + let fadeOffset = Math.min(this._grid.topPadding, + this._grid.bottomPadding); + this._scrollView.update_fade_effect(fadeOffset, 0); + this._scrollView.get_effect('fade').fade_edges = true; + if (this._availWidth != availWidth || this._availHeight != availHeight || oldNPages != this._grid.nPages()) { - this._verticalAdjustment.value = 0; + this._adjustment.value = 0; Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() { this._pageIndicators.setNPages(this._grid.nPages());